<template>
    <div class="">
        <el-dialog title="编辑会议" :visible.sync="dialog" width="55%" :before-close="dialogClose">
            <el-form ref="formData" :model="formData" label-width="100px">
                <el-form-item label="会议标题" prop="title">
                    <el-input v-model="formData.title" placeholder="请输入会议标题"></el-input>
                </el-form-item>
				<el-form-item label="主持人" prop="header">
				    <el-input v-model="formData.header" placeholder="请输入主持人"></el-input>
				</el-form-item>
				<el-form-item label="会议时间" prop="date">
				    <el-date-picker
						style="width: 100%;"
						v-model="formData.date"
						type="datetime"
						format="yyyy-MM-dd HH:mm:ss"
						value-format="yyyy-MM-dd HH:mm:ss"
						placeholder="选择日期">
					</el-date-picker>
				</el-form-item>
				<el-form-item label="会议地址" prop="addr">
				    <el-input v-model="formData.addr" placeholder="请输入会议地址"></el-input>
				</el-form-item>
                <el-form-item label="会议内容" prop="content">
                    <quill-editor ref="myTextEditor" v-model="formData.content" :options="editorOption"></quill-editor>
                </el-form-item>
            	<el-form-item>
            		<el-button @click="dialogClose">取 消</el-button>
            		<el-button type="primary" @click="formSubmit">确 定</el-button>
            	</el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script>
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
import { quillEditor } from 'vue-quill-editor';
export default {
	components: {
		quillEditor,
	},
	data() {
		return {
			dialog: false,
			formData: {
				id: 0,
				title: '',
				content: '',
			},
			editorOption: {
				placeholder: '请输入内容'
			},
		}
	},
	created() {
	},
	watch: {
		dialog () {
			if(!this.dialog) {
				this.clearFormData()
				this.$emit('getData')
			}
		}
	},
	methods: {
		dialogClose(){
			this.$emit('dialogToggle')
		},
		clearFormData () {
			for(let i in this.formData){
				if(i == 'id') {
					this.formData[i] = 0
				} else {
					this.formData[i] = ''
				}
			}
		},
		// 保存编辑
		formSubmit() {
			this.$apiPost('Meeting/editData', this.formData).then(res => {
				if(res.code == 1) {
					this.$message(res.msg)
					this.dialogClose()
				} else {
					this.$message(res.msg)
				}
			})
		},
	}
}
</script>
<style scoped>
	.mselect{
		width: 100%;
	}
	.mtdiv{
		margin-top: 10px;
		display: inline-block;
		width: 100%;
	}
	.mtdiv .mtdiv-v{
		float: left;
		width: 50%;
		margin-bottom: 5px;
		display: flex;
		align-items: center;
	}
	.mtdiv .mtdiv-v label{
		float: left;
		margin-right: 10px;
	}
	.mtdiv .el-input{
		float: left;
		width: 80%;
		margin: 5px 0;
	}
</style>
